<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Grima Portal</title>
	<link rel="stylesheet" type="text/css" href="css/themes/bootstrap/easyui.css">
	<link rel="stylesheet" type="text/css" href="css/icon.css">
	<link rel="stylesheet" type="text/css" href="css/portal.css">
	<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
	
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>

<body class="easyui-layout">

    <div id="header" data-options="region:'north',border:false" style="height:40px;padding:10px;overflow: hidden;">
        <div style="float: left;">
	               <a href="index.html" style="text-decoration: none;">
	                       <img alt="" src="img/logo.png"/>
	                       <img alt="" src="img/portal.png"/>
	               </a>
        </div>
	</div>
	<div id="login" title="Login">
		<div >
		    <form id="ff" method="post" >
				<div class="input-group margin-bottom-sm">
				  <span class="input-group-addon"><i class="fa fa-envelope-o fa-fw"></i></span>
				  <input id="email" class="form-control" type="text" placeholder="E-mail" size="30">
				</div>
				<div class="input-group">
				  <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
				  <input id="password" class="form-control" type="password" placeholder="Senha" size="30">
				</div>
		    </form>
	    </div>
   	    <div style="float:left;">
	    	<a href="#" style="font-size: 10px;" onclick="forgotPassword();">Esqueci minha senha</a>
   		</div>

	    <div style="float:right;">
	    	<a href="index.html" class="easyui-linkbutton" onclick="submitForm();">Entrar</a>
	    </div>
	</div>
	
	 <div id="footer" data-options="region:'south',border:true" style="overflow: hidden;"></div>
	
	<script>
		$('#footer').load('footer.html');
		$('#email').focus();
		
		function submitForm(){
			$('#ff').form('submit');
		}

		jQuery.fn.center = function () {
		    this.css("position","fixed");
		    this.css("top", ($(window).height() / 2) - (this.outerHeight() / 2));
		    this.css("left", ($(window).width() / 2) - (this.outerWidth() / 2));
		    return this;
		}

		$('#login').center();
		
		$(window).resize(function(){
		   $('#login').center();
		});
		
		function forgotPassword(){
			$.messager.alert('Atenção','A senha foi enviada para o seu e-mail!','info');
		}
		
	</script>    
</body>

</html>